<!DOCTYPE html>
<script src="../../resources/js-test.js"></script>
<script src="resources/alignment-parsing-utils.js"></script>
<body>
<script>
description('Test to verify initial values of alignment properties are backward-comaptible with flexbox implementation.');

function setInitialValues(element)
{
    element.style.alignItems = "initial";
    element.style.alignContent = "initial";
    element.style.justifyContent = "initial";
}

function checkSupportedInitialValues(element)
{
    checkSupportedValues(element.id, "align-items");
    checkSupportedValues(element.id, "align-self");
    checkSupportedValues(element.id, "align-content");
    checkSupportedValues(element.id, "justify-content");
}

var root = document.createElement("div");
document.body.appendChild(root);

var container = document.createElement("div");
container.id = "container";
root.appendChild(container);
var item = document.createElement("div");
item.id = "item";
container.appendChild(item);

var flexContainer = document.createElement("div");
flexContainer.id = "flexContainer";
flexContainer.style.display = "flex";
root.appendChild(flexContainer);
var flexItem = document.createElement("div");
flexItem.id = "flexItem";
flexContainer.appendChild(flexItem);

setInitialValues(root);
setInitialValues(container);
setInitialValues(item);
setInitialValues(flexContainer);
setInitialValues(flexItem);

checkSupportedInitialValues(container);
checkSupportedInitialValues(item);
checkSupportedInitialValues(flexContainer);
checkSupportedInitialValues(flexItem);

document.body.removeChild(root);
</script>
</body>
